<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>相应式顶部栏导航</title>
    <link type="text/css" href="../CSSFile/index.css" rel="stylesheet">
</head>
<body>

<ul class="sidenav">
    <li>
        <a href="#">
            <h4>
                主页
            </h4>
        </a>
    </li>
    <li>
        <a href="#" class="actvte">
            <h4>
                新的博客
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                我的吐槽
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                关于
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                我的吐槽
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                关于
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                我的吐槽
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                关于
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                我的吐槽
            </h4>
        </a>
    </li>
    <li>
        <a href="#">
            <h4>
                关于
            </h4>
        </a>
    </li>
</ul>

<div class="context">
    <h2>
        相应式的边栏导航实例
    </h2>
    <p>

    </p>
</div>
</body>
</html>